<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="../static/js/layui/css/layui.css" th:href="@{/js/layui/css/layui.css}" media="all">
    <script src="../static/js/layui/layui.js" th:src="@{/js/layui/layui.js}" charset="utf-8"></script>
    <script src="../static/js/jquery-3.4.1.min.js" th:src="@{/js/jquery-3.4.1.min.js}" charset="utf-8"></script>
    <style>
        /*上下左右居中*/
        .main {
            display: flex;
            justify-content: center;
            align-items: center;
            /*margin-top: 70px;*/
            margin: 70px auto;
            width: 400px;
            height: auto;
            padding: 30px;
        }
        .wearr{
            width: 100%;
            height: 100%;
        }
    </style>
</head>

<body>
<div class="wearr">
<!--    <img src="../static/imgs/1.jpg" th:src="@{'/imgs/1.jpg'}" class="imgStyle">-->
<div style="text-align: center;margin-top: 100px">
    <h1>宁波中国科学院信息技术应用研究院</h1>
</div>
<div class="main layui-bg-gray">
    <form class="layui-form">
        <div class="layui-form-item">
            <h1 style="text-align: center">现金券管理系统</h1>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">账号<i class="layui-icon layui-icon-username"></i></label>
            <div class="layui-input-block">
                <input type="text" id="uname" name="uname" placeholder="请输入账号" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密码<i class="layui-icon layui-icon-password"></i></label>
            <div class="layui-input-block">
                <!-- 为了方便测试，密码类型设置成text，发布生产前记得改回来 -->
                <input type="password" id="upwd" name="upwd" placeholder="请输入密码" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="float: right;">
            <input id="remember-me" type="checkbox" title="七天免登陆" name="rememberMe" checked lay-skin="primary">
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <a class="layui-btn" style="margin-left: -50px;margin-right: 50px;" onclick="formSubmit()">登录</a>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>
</div>
</body>
<script>
    let layer;
    console.log(layui)
    layui.use(['layer','form'], function () {
        layer = layui.layer;
        let form = layui.form;//select、单选、复选等依赖form
        //进入首先判断是否登录访问
        $(function () {
            var msg = "[[${msg}]]";
            if($.isEmptyObject(msg)){
                console.log("登录了，请访问！")
            }else{
                // layer.msg(msg);
                alert(msg);
            }

        });

        /**
         * 监听键盘事件
         */
        document.addEventListener("keydown",function (even) {
            //按下Enter回车键
            if(even.keyCode === 13){
                formSubmit();
            }
        })
    });

    /**
     * 登录
     */
    function formSubmit() {
        $.post("user/login", {
            "uname": $("#uname").val(),
            "upwd": $("#upwd").val(),
        }, function (data) {
            if (data.msg == 'ok') {
                location.href = "/index";
            } else {
                location.reload();
            }
        })
    }

    /**
     * 刷新验证码
     */
    function changeCode() {
        var img = document.getElementById("captchaImg");
        img.src = ctx + "/getVerifyCodeImage?time=" + new Date().getTime();
    }
</script>
</html>